<template>
  <v-main class="full-height">
    <v-app-bar
        flat
        fixed
        align="center"
        height="60px"
    >
      <v-container>
        <v-row justify="center" class="py-0">
          <v-col cols="3" class="text-left pl-0">
            <v-btn icon @click="$router.back()" class="ml-n3" >
              <v-icon color="lighten-1" >mdi-arrow-left</v-icon>
            </v-btn>
          </v-col>
          <v-col cols="6">
            <div class="mt-3">
              修改邮箱
            </div>
          </v-col>
          <v-col cols="3" class="text-right pr-0">
            <v-btn icon @click="commit" class="mr-n3">
              <v-icon color="primary" size="30">mdi-check</v-icon>
            </v-btn>
          </v-col>
        </v-row>
      </v-container>
    </v-app-bar>
    <v-container class="mt-15">
      <v-row justify="center" class="mt-5">
        <v-col cols="12" class="">
          <v-text-field class="py-0"
                        ref="email1"
                        placeholder="请输入邮箱"
                        :rules="[rules.required,rules.email]"
                        v-model="form.email"
          >
          </v-text-field>
        </v-col>
      </v-row>
    </v-container>
  </v-main>
</template>

<script>
import {rules, simpleCopy} from "../util/util";

export default {
  name: "changeEmail",
  data:()=>({
    form:{
      email:'',
      uid:'',
    },
    rules:rules

  }),
  methods:{
    commit(){
      if (!this.$refs['email1'].validate(true)){
        return
      }

      let data = this.form
      this.$http.post('user/changeInfo',data).then(res=>{
        this.$emit('toast','修改成功')
        this.$store.commit('init',res.data)
      }).catch(res=>{
        this.$emit('toast',res.msg)
      })
    }
  },
  mounted() {
    simpleCopy(this.$store.state,this.form)
  }
}
</script>

<style scoped>

</style>
